﻿<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
  <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
  <title>我是传奇-礼包领取</title>
  <link rel="stylesheet" type="text/css" href="css/reset.css">
  <link rel="stylesheet" type="text/css" href="css/css.css">
  <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
  <body>
    <div class="header">
      <div class="content">
        <a href="index.html"><h1>官网首页</h1><span>HOME</span></a>
        <a href=""><h1>储值大厅</h1><span>CHARGE</span></a>
        <a href="support.html"><h1>客服中心</h1><span>SUPPORT</span></a>
        <a href=""><h1>礼包领取</h1><span>GIVEAWAYS</span></a>
      </div>
    </div>
    <div class="content">
      <img src="images/logo.png" class="logo">
      <!-- 礼包 -->
      <div class="giveaways_wrap">
        <div class="giveaways">
          <div class="row">
            <img src="images/giveaway_img.jpg">
            <div class="middle">
              <div class="g_name">礼包名称：xxx</div>
              <div class="g_time">有效期：xxx</div>
              <div class="g_content">礼包内容：xxx</div>
              <div class="g_desc">其他介绍：禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描
              述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述.</div>
            </div>
            <div class="right">
              <div class="g_left">礼包剩余：<span></span></div>
              <div class="g_left_percent">剩余<span>90%</span></div>
              <div class="get_giveaways_btn">点击领取</div>
            </div>
          </div>
          <div class="row">
            <img src="images/giveaway_img.jpg">
            <div class="middle">
              <div class="g_name">礼包名称：xxx</div>
              <div class="g_time">有效期：xxx</div>
              <div class="g_content">礼包内容：xxx</div>
              <div class="g_desc">其他介绍：禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描
              述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述禮包描述.</div>
            </div>
            <div class="right">
              <div class="g_left">礼包剩余：<span></span></div>
              <div class="g_left_percent">剩余<span>90%</span></div>
              <div class="get_giveaways_btn">点击领取</div>
            </div>
          </div>
        </div>
      </div>
      <!-- 礼包结束 -->
      <div class="mask" style="display:block">
        <div class="giveaways_popup popup">
          <div class="close">+</div>
          <div class="title">恭喜！领取成功</div>
          <div class="code">您的礼包码：AA123456789 <span>点击复制</span></div>
          <div class="use">礼包码使用方式：礼包码使用方式礼包码使用方式礼包码使用方式礼包码使用方式礼包码使用方式礼包码使用方式礼包码使用方式</div>
        </div>
      </div>
    </div>
    <div class="footer"></div>
  </body>
<script>
  $('.close').click(function(){
    $('.popup').hide();
    $('.mask').hide();
  })
  $('.get_giveaways_btn').click(function(){
    $('.popup').show();
    $('.mask').show();
  })
</script>
</html>
